
<style lang="scss" scoped>
    @import "../../css/effect.scss";
    @import "../../css/exam2.scss";
    .qnr-detail-box{padding:30px;background: #fff;}

    .show-exam-title{width: 70%;}

    .edit-icon{width: 40px; height: 40px; float: right; cursor: pointer; background: #f7f8fa url('http://jhsy-img.caizhu.com/sass/images/icon-edit.png') no-repeat center center;}
    .save-icon{width: 40px; height: 40px; float: right; cursor: pointer; background: #f7f8fa url('../../images/save-ic.png') no-repeat center center;}

    .hide{display: none;}
</style>
<style>
    .limit-input .el-input{width: 50px;height:42px;}
</style>

<template>
    <section>

<!--         <section class="breadcrumb-box clearfix">
            <el-breadcrumb separator=" > " class="fl">
                <el-breadcrumb-item>效果评估</el-breadcrumb-item>
                <el-breadcrumb-item v-if="$route.meta">{{$route.meta.title}}</el-breadcrumb-item>
            </el-breadcrumb>
        </section> -->

        <section class="qnr-detail-box all"> <!--问卷展示-->

            <!--编辑问卷-->
            <section>
                <el-form  :model="QNRForm" :rules="QNRrules" ref="QNRForm" >

                    <div  class="mt20">
                        <section >

                            <!--问卷编辑状态-->
                            <el-form-item label="问卷名称" prop="ExamTitle">
                                <el-input placeholder="请输入问卷名称" v-if="QNRCreate == false" v-model="QNRForm.ExamTitle"></el-input>
                                <el-input placeholder="请输入问卷名称" v-if="QNRCreate == true" v-model="QNRForm.ExamTitle" :disabled="QNRTitle.paperFlag == false" @focus="QNRTitleFocus"></el-input>
                                <template v-if="QNRCreate == true"><!--问卷显示状态--> <!-- 显示问卷头部信息 -->    <!-- v-if="paperFlag == true" -->
                                    <template v-if="showButton == true">
                                        <span class="edit-icon" v-if="QNRTitle.paperFlag == false" @click="QNRTitle.paperFlag=true"></span>
                                        <span class="save-icon" v-if="QNRTitle.paperFlag == true" @click="doSaveQNRTitle"></span>
                                    </template>
                                </template>
                            </el-form-item>
                            <el-form-item label="问卷描述" prop="ExamDesc">
                                <el-input placeholder="请输入问卷描述" v-if="QNRCreate == false" v-model="QNRForm.ExamDesc"></el-input>
                                <el-input placeholder="请输入问卷描述" v-if="QNRCreate == true" v-model="QNRForm.ExamDesc" :disabled="QNRDes.paperFlag == false"  @focus="QNRDesFocus"></el-input>
                                <template v-if="QNRCreate == true"><!--问卷显示状态--> <!-- 显示问卷头部信息 -->    <!-- v-if="paperFlag == true" -->
                                    <template v-if="showButton == true">
                                        <span class="edit-icon" v-if="QNRDes.paperFlag == false" @click="QNRDes.paperFlag=true"></span>
                                        <span class="save-icon" v-if="QNRDes.paperFlag == true" @click="doSaveQNRDes"></span>
                                    </template>
                                </template>
                            </el-form-item>



                            <section class="mt40 naire-bottom-deal">

                                <!--初始化题目添加-->
                                <!--按钮展开-->
                                <!--初始化选择题-->
                                <template v-if="showButton === true">
                                    <div class="exam-addbox mt20">
                                        <span class="exama-one exama-i0" @click="addOne(2)">单选题</span>
                                        <span class="exama-one exama-i1" @click="addOne(1)">多选题</span>
                                        <span class="exama-one exama-i2" @click="addOne(3)">问答题</span>
                                    </div>
                                </template>

                                <!-- 开始题目循环 -->
                                <template v-for="(outer,index) of QNRForm.Questions" >   <!-- QuestionType:1, 多选题  2，单选题 3，问答 -->
                                    <!-- 单选题+多选题 -->
                                    <!--<section v-if="!outer.editFlag">  &lt;!&ndash; 显示状态 &ndash;&gt;-->
                                    <section :class="{ hide : outer.editFlag } ">  <!-- 显示状态 -->
                                        <div class="exam-one clearfix mt20" v-if="outer.QuestionType!=3">
                                            <div class="examo-lef">
                                                <div class="">Q{{index+1}}</div>
                                                <template v-if="showButton == true"> <!--外层控制-->
                                                    <template v-if="outer.Editable == 1">
                                                        <div class="examo-do examo-edit mt" @click="editOne(index)"></div>
                                                    </template>
                                                    <template v-if="QNRForm.Questions.length > 1">
                                                        <div class="examo-do examo-del" @click="delOne(index,outer)"></div>
                                                    </template>
                                                </template>
                                            </div>
                                            <div class="examo-rig">
                                                <!-- 标题 -->
                                                <div class="examo-tit examo-line clearfix">
                                                    <div class="examo-f01 show-exam-title">
                                                        <span v-if="outer.QuestionType==1">【多选题】</span>
                                                        <span v-else>【单选题】</span>

                                                        <span class="">{{outer.QuestionTitle}}</span>
                                                        <!--<span v-if="outer.IsNeed == 1">【必答】</span>-->
                                                    </div>
                                                </div>
                                                <!-- 选项 -->
                                                <div class="examo-one examo-line mt20 clearfix" v-for="one,iIndex in outer.Answers">
                                                    <div class="examo-f00">
                                                        <el-radio :label="iIndex" v-if="outer.QuestionType==2" disabled="true">{{answerArr[iIndex]}}</el-radio>
                                                        <!--<label disabeld v-else>
                                                            <span class="exam-checkbox"></span>
                                                        </label>-->
                                                        <el-checkbox disabled v-else>{{answerArr[iIndex]}}</el-checkbox>
                                                        <span>{{one.AnswerValue}}</span>
                                                    </div>
                                                </div>

                                                <!--限制项 显示状态-->
                                                <div v-if="outer.QuestionType == 1 " class="mt20 limit-input">
                                                    <template v-if="outer.LimitAnswerNum > 0">
                                                        <el-checkbox  v-model="outer.limitChecked" disabled>限制最多选择数</el-checkbox>
                                                        <span class="limit-num ml20" >最多可选</span>
                                                        <el-input v-model="outer.LimitAnswerNum" disabled></el-input>
                                                        <span class="limit-num">项</span>
                                                    </template>
                                                </div>

                                            </div>
                                        </div>
                                        <!-- 问答题 -->
                                        <div class="exam-one clearfix mt20" v-else>
                                            <div class="examo-lef">
                                                <div class="">Q{{index+1}}</div>
                                                <template v-if="outer.Editable == 1">
                                                    <div class="examo-do examo-edit mt" @click="editOne(index)"></div>
                                                </template>
                                                <template v-if="QNRForm.Questions.length > 1">
                                                    <div class="examo-do examo-del" @click="delOne(index,outer)"></div>
                                                </template>
                                            </div>
                                            <div class="examo-rig">

                                                <div class="examo-one examo-line clearfix">
                                                    <div class="examo-f00 show-exam-title">
                                                        <span>【问答题】</span>
                                                        <!--<el-input class="examo-inp00" placeholder="标题"></el-input>-->
                                                        {{outer.QuestionTitle}}
                                                        <!--<span class="ml20" v-if="outer.IsNeed == 1">【必答】</span>-->
                                                    </div>
                                                </div>
                                                <div class="mt20">
                                            <span v-if="outer.Answers.length == 0">
                                                 <!--<el-input type="textarea" :rows="5" placeholder="请输入问答答案..."></el-input>-->
                                            </span>
                                            <!--<span v-if="outer.Answers.length > 0">
                                                <el-input type="textarea" :rows="5" placeholder="请输入问答答案..."></el-input>
                                            </span>-->
                                                    <!--<el-input type="textarea" :rows="5" placeholder="请输入问答答案...">
                                                    </el-input>-->
                                                </div>
                                            </div>
                                        </div>

                                    </section>

                                    <section :class="{hide:!outer.editFlag}">   <!-- 编辑状态 -->
                                        <div class="exam-one clearfix mt20" v-if="outer.QuestionType!=3">
                                            <div class="examo-lef">
                                                <div class="">Q{{index+1}}</div>
                                                <!--<div class="examo-do examo-edit mt"></div>-->
                                                <template v-if="QNRForm.Questions.length > 1">
                                                    <template v-if="editOldQNRTopic">
                                                        <template v-if="!createNewQNRTopic">
                                                            <div class="examo-do examo-del" @click="delEditOne(index,outer)"></div>
                                                        </template>
                                                    </template>
                                                    <template v-if="!editOldQNRTopic">
                                                        <template v-if="createNewQNRTopic">
                                                            <div class="examo-do examo-del mt20" @click="delEdit(index)"></div>
                                                        </template>
                                                    </template>
                                                </template>

                                            </div>
                                            <div class="examo-rig">
                                                <!-- 标题 -->
                                                <div class="examo-tit clearfix">
                                                    <div class="examo-f00">
                                                        <el-input class="examo-inp00" placeholder="标题" v-model="outer.QuestionTitle"></el-input>
                                                    </div>
                                                    <div class="examo-f01">
                                                        <span v-if="outer.QuestionType==1">【多选题】</span>
                                                        <span v-else>【单选题】</span>
                                                    </div>
                                                    <!--<div class="examo-f01">-->
                                                        <!--<el-checkbox v-model="outer.isSingleNeed" @change="isNeedChange(index)">-->
                                                            <!--【必答】-->
                                                        <!--</el-checkbox>-->
                                                    <!--</div>-->

                                                    <!--<div class="examo-f02">-->
                                                    <!--<span>分值</span>-->
                                                    <!--<el-input class="examo-inp01" v-model="outer.RightScore"></el-input>-->
                                                    <!--<span>分</span>-->
                                                    <!--</div>-->
                                                </div>
                                                <!-- 选项 -->
                                                <div class="examo-one mt20 clearfix" v-for="one,iIndex in outer.Answers">
                                                    <div class="examo-f00">

                                                        <!--<span v-if="outer.QuestionType==2"><el-radio disabled="true"></el-radio></span>
                                                        <span v-else><el-checkbox disabled></el-checkbox></span>-->
                                                        <el-radio v-model="outer.RightAnswerIDs" :label="iIndex" v-if="outer.QuestionType==2">{{answerArr[iIndex]}}</el-radio>
                                                        <label v-else>
                                                            <span class="exam-checkbox"></span>
                                                            <span>{{answerArr[iIndex]}}</span>
                                                        </label>

                                                        <!--<span class="mr">{{answerArr[iIndex]}}</span>-->
                                                        <el-input class="examo-inp02 ml" placeholder="标题" v-model="one.AnswerValue"></el-input>

                                                    </div>
                                                    <div class="examo-f02">
                                                        <span class="examo-do examo-tot" :class="{'hide':firstIndex == iIndex}" @click="switchUp(one,iIndex,outer.Answers,outer)"></span>  <!--升序-->
                                                        <span class="examo-do examo-tob" :class="{'hide': outer.Answers.length-1 == iIndex}" @click="switchDown(one,iIndex,outer.Answers,outer)"></span>  <!--降序-->
                                                        <span class="examo-do examo-del" @click="delAnswerOne(index,iIndex)"></span>  <!--删除选项-->
                                                    </div>
                                                </div>
                                                <!-- 添加按钮 -->
                                                <div class="examo-add mt20" @click="addAnswerOne(index)">+添加选项</div>

                                                <!--限制项 编辑状态-->

                                                <div v-if="outer.QuestionType == 1 " class="mt20 limit-input">
                                                    <el-checkbox  v-model="outer.EditlimitChecked" @change="limitCheckedChange(index)">限制最多选择数</el-checkbox>
                                                    <span class="limit-num ml20" >最多可选</span>
                                                    <el-input v-model="outer.LimitAnswerNum" @blur="limitBlur(index)" :disabled="!outer.EditlimitChecked"></el-input>
                                                    <span class="limit-num">项</span>
                                                </div>

                                                <!--<div class="examo-save mt20" @click="saveAnswerOne(index, outer.QuestionType)" v-if="outer.editFlag">保存</div>
                                                <div class="examo-cancel mt20 ml" @click="cancelAnswerOne(index)" v-if="cancelOneFlag">取消</div>-->

                                                <template v-if="!editOldQNRTopic">
                                                    <template v-if="createNewQNRTopic">
                                                        <div class="examo-save mt20" @click="saveAnswerOne(outer,index, outer.QuestionType)" v-if="outer.editFlag">保存</div>
                                                        <div class="examo-cancel mt20 ml" @click="cancelAnswerOne(index)" v-if="cancelOneFlag">取消</div>
                                                    </template>
                                                </template>
                                                <template v-if="editOldQNRTopic">
                                                    <template v-if="!createNewQNRTopic">
                                                        <div class="examo-save mt20" @click="saveAnswerOne(outer,index, outer.QuestionType)" v-if="outer.editFlag">保存</div>
                                                        <div class="examo-cancel mt20 ml" @click="holdOldOne(index)" v-if="cancelOneFlag">取消</div>
                                                    </template>
                                                </template>

                                            </div>
                                        </div>
                                        <!-- 问答题 -->
                                        <div class="exam-one clearfix mt20" v-else>
                                            <div class="examo-lef">
                                                <div class="">Q{{index+1}}</div>
                                                <!--<div></div>-->
                                                <template v-if="QNRForm.Questions.length > 1">
                                                    <template v-if="editOldQNRTopic">
                                                        <template v-if="!createNewQNRTopic">
                                                            <div class="examo-do examo-del" @click="delEditOne(index,outer)"></div>
                                                        </template>
                                                    </template>
                                                    <template v-if="!editOldQNRTopic">
                                                        <template v-if="createNewQNRTopic">
                                                            <div class="examo-do examo-del mt20" @click="delEdit(index)"></div>
                                                        </template>
                                                    </template>
                                                </template>

                                            </div>
                                            <div class="examo-rig">

                                                <div class="examo-one clearfix">
                                                    <div class="examo-f00">
                                                        <el-input class="examo-inp00" placeholder="标题" v-model="outer.QuestionTitle"></el-input>
                                                    </div>
                                                    <div class="examo-f01">
                                                        <span>【问答题】</span>
                                                    </div>
                                                    <!--<div class="examo-f01">-->
                                                        <!--<el-checkbox v-model="outer.isSingleNeed" @change="isNeedChange(index)">-->
                                                            <!--【必答】-->
                                                        <!--</el-checkbox>-->
                                                    <!--</div>-->

                                                    <!--<div class="examo-f02">-->
                                                    <!--<span>分值</span>-->
                                                    <!--<el-input class="examo-inp01" v-model="outer.RightScore"></el-input>-->
                                                    <!--<span>分</span>-->
                                                    <!--</div>-->
                                                </div>
                                                <div class="mt20">
                                                    <!-- <el-input type="textarea" :rows="5" placeholder="请输入问答答案..." v-model="outer.Answers[0].AnswerValue">
                                                     </el-input>-->

                                                    <!--<el-input type="textarea" :rows="5" placeholder="请输入问答答案...">
                                                    </el-input>-->
                                                </div>
                                                <template v-if="!editOldQNRTopic">
                                                    <template v-if="createNewQNRTopic">
                                                        <div class="examo-save mt20" @click="saveAnswerOne(outer,index, outer.QuestionType)" v-if="outer.editFlag">保存</div>
                                                        <div class="examo-cancel mt20 ml" @click="cancelAnswerOne(index)" v-if="cancelOneFlag">取消</div>
                                                    </template>
                                                </template>
                                                <template v-if="editOldQNRTopic">
                                                    <template v-if="!createNewQNRTopic">
                                                        <div class="examo-save mt20" @click="saveAnswerOne(outer,index, outer.QuestionType)" v-if="outer.editFlag">保存</div>
                                                        <div class="examo-cancel mt20 ml" @click="holdOldOne(index)" v-if="cancelOneFlag">取消</div>
                                                    </template>
                                                </template>

                                            </div>
                                        </div>
                                    </section>

                                </template>

                                <!--添加选择题-->
                                <template v-if="showButton == true">
                                    <div class="exam-addbox mt20" :class="{hide:!QNRForm.Questions.length}">
                                        <span class="exama-add mr"></span>
                                        <template v-if="addBtnFlag">
                                            <span class="exama-one exama-tip" @mouseover="addOver">添加题目</span>
                                        </template>
                                        <template v-else>
                                            <div class="exama-dos" @mouseout="outAddBtn" @mousemove="moveAddBtn">
                                                <span class="exama-one exama-i0" @click="addOne(2,true)">单选题</span>
                                                <span class="exama-one exama-i1" @click="addOne(1,true)">多选题</span>
                                                <span class="exama-one exama-i2" @click="addOne(3,true)">问答题</span>
                                            </div>
                                        </template>
                                    </div>
                                </template>

                                <!--生成问卷-->
                                <!--<section class="mt40" style="width: 100%;text-align: center;">
                                    <el-button class="btn-active btn-or" @click="toBecomeQuestionnaire">生成问卷</el-button>
                                </section>-->

                                <div class="exama-minor mt20" :class="{hide:!addFlag}">
                                    <el-checkbox v-model="QNRForm.isJoinExamLib" true-label="1" value="1">将试卷保存到试卷库</el-checkbox>
                                    <el-checkbox v-model="QNRForm.isJoinQuestionLib" true-label="1" value="1">将试题保存到题库</el-checkbox>
                                </div>
                               <!-- <div class="mt20">
                                    <el-button type="primary" @click="submitForm('QNRForm')">提交</el-button>
                                </div>-->

                            </section>
                        </section>
                    </div>


                </el-form>

            </section>

        </section>

    </section>
</template>

<script>

	import qs from 'qs'
	import com from 'js/common'
	let answerArr = ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'G', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z'];

	export default{
		data: function(){
			return {
				editFlag: false,      // 是否编辑当中
				answerArr:answerArr,
				ExamQNRID:'',// 问卷id
				QNRForm:{  // 一张问卷
					Questions:[],
				},
				QNRrules:{
					ExamTitle: [
						{ required: true, message: '请输入问卷名称', trigger: 'blur' }
					],
					ExamDesc: [
						{ required: true, message: '请输入问卷描述', trigger: 'blur' }
					],
				},
				QNRCreate: true,  //未点击生成问卷状态（是否提交 ）

				QNRTitle:{ // 展示状态下修改
					paperFlag: false, // 问卷标题编辑状态
				},
				QNRDes:{
					paperFlag: false, // 问卷描述编辑状态
				},

				contentList:[], // 选项list


				editTip: '请先完成问卷的编辑！',
				cancelOneFlag: false,      // 添加题目时取消添加
				addBtnFlag: true,      // 是否显示添加试题按钮

				outTimeId: '', // 显示隐藏按钮

				editOldQNRTopic: false, // 默认未修改旧题目
				createNewQNRTopic: false, // 默认未新增

				examLibQIDs:'', // 字符串（数字组成的字符串）--所有题目的id 组成的字符串

				showButton: false, /*默认不展示-关联-外层的Editable*/

				firstIndex: 0,

            }
		},
		mixins: [mixinMethods],
		methods: {
			/*icey*/
			getQNRId(){  // 获取问卷id
                let self =this;
				self.ExamQNRID = self.$route.query.ExamQNRID;
                console.log(self.ExamQNRID);
                this.getExamQNRInfo(self.ExamQNRID);
            },
            getExamQNRInfo(id){  // 获取问卷详情
				let self = this;
				axios.post('/com/exam/getQNRLib', qs.stringify({  //库问卷详情
					examLibID: id
				})).then( (res)=>{
					var d = res.data;
					self.editFlag = false;
					if(d.flag == 1){
						d = d.data;// 赋值
						d.Questions.forEach(function(one){
							one.editFlag = false;
						});

						//this.editFlag = true;

						d.Questions.forEach((item)=>{
							self.contentList = item.Answers;
							if(item.QuestionType == 1){
								if(item.LimitAnswerNum > 0){
									item.limitChecked = true;  /*显示状态*/
									item.EditlimitChecked = true;

								}else{
									item.limitChecked = false; /*显示状态*/
									item.EditlimitChecked = false;
								}
							}
							if(item.IsNeed == "1"){
								item.isSingleNeed = true;
							}else if(item.IsNeed == "0"){
								item.isSingleNeed = false;
							}

						});

						if(d.Editable == 1){ /*后台添加的问卷(外层的Editable)--不能被编辑*/
							this.showButton = true; /*可编辑*/
                        }else if(d.Editable == 0){
							this.showButton = false;/*不可编辑*/
                        }

						self.QNRForm = d; // 赋值isSingleNeed: true,EditlimitChecked: true,limitChecked: false,

						self.QNRForm.ExamLibID= id;
						console.log(self.QNRForm.Questions)
					}
				} );
            },

			addOne: function(n, type){      // 添加试题  type(boolean)，true,底部添加按钮

				if(this.editFlag){
					this.$message.error(this.editTip)
					return ;
				}

				this.createNewQNRTopic = true; // 新增
				this.editOldQNRTopic = false; // 未修改旧题目
				this.editFlag = true;
				this.cancelOneFlag = true;
				if(type){
					this.createNewQNRTopic = true; // 新增
					this.editOldQNRTopic = false; // 未修改旧题目
					this.cancelOneFlag = true;
					this.addBtnFlag = true;
				}

				var obj;
// RightAnswerIndexs
				if(n==1){  // + 多选
					obj = {QuestionTitle: '',isSingleNeed: true,EditlimitChecked: false,limitChecked: false,ExamLibQID: '0',LimitAnswerNum: '',Editable:1,
						Answers: [
							{},
							{},
							{},
							{}
						]
					}
				}else if(n == 3){  // 问答  没有答案-没有分数
					obj = {AnswerValue: '',ExamLibQID: '0',isSingleNeed: true,Editable:1,
						Answers: [
							{},
							{}
						]
					}
				}else if(n == 2){ /*单选 */
					obj = {QuestionTitle: '',isSingleNeed: true,ExamLibQID: '0',Editable:1,
						Answers: [
							{},
							{},
							{},
							{}
						]
					}
                }

				if(n == 1){ // 单选
					obj.QuestionType = 1;
					//obj.RightAnswerIndexs = [];
				}else if(n == 2){ // 多选
					obj.QuestionType = 2;
					//obj.RightAnswerIndexs = '';
				}else if(n == 3){ // 问答
					obj.QuestionType = 3;
				}

				obj.editFlag = true;      // 默认编辑状态

				this.QNRForm.Questions.push(obj);
			},

			addAnswerOne: function(index){      // 增加小题中的选项
				var one = this.QNRForm.Questions[index];


				if(one){
					one.Answers.push({});
				}

			},

			doSendOldTopic(item,outerIndex){
				let self =this;
				if(item.QuestionType == 2){ // 单选题

					axios.post('/com/exam/editQNRLib', qs.stringify({
						examLibID: self.QNRForm.ExamLibID,

						examLibQIDs: self.examLibQIDs,
						question: {
							QID:item.QID,
							ExamLibQID: item.ExamLibQID,
							QuestionType: item.QuestionType,
							QuestionTitle: item.QuestionTitle,
							IsNeed: item.IsNeed,
//							LimitAnswerNum : item.LimitAnswerNum,
							Answers:  item.Answers,
						},
					})).then( (res) => {
						var d = res.data;
						if(d.flag == 1){
							self.$message.success('编辑成功');

							self.QNRForm.Questions[outerIndex].editFlag = false;
							self.editFlag = false;
							self.cancelOneFlag = false;

							this.editOldQNRTopic = false; // 恢复默认未修改旧题目
							this.createNewQNRTopic = false; // 未新增

						}else{
							self.$message.error(d.msg);
						}
					} );

				}else if(item.QuestionType == 1){ // 多选题
					axios.post('/com/exam/editQNRLib', qs.stringify({
						examLibID: self.QNRForm.ExamLibID,

						examLibQIDs: self.examLibQIDs,
						question: {
							QID:item.QID,
							ExamLibQID: item.ExamLibQID,
							QuestionType: item.QuestionType,
							QuestionTitle: item.QuestionTitle,
							IsNeed: item.IsNeed,
							LimitAnswerNum : item.LimitAnswerNum,
							Answers:  item.Answers,
						},
					})).then( (res) => {
						var d = res.data;
						if(d.flag == 1){
							self.$message.success('编辑成功');

							self.QNRForm.Questions[outerIndex].editFlag = false;
							self.editFlag = false;
							self.cancelOneFlag = false;
							this.editOldQNRTopic = false; // 恢复默认未修改旧题目
							this.createNewQNRTopic = false; // 未新增

                            if(item.LimitAnswerNum > 0){
                            	item.limitChecked = true;
                            }else{
								item.limitChecked = false;
                            }

						}else{
							self.$message.error(d.msg);
						}
					} );

				}else if(item.QuestionType == 3){ // 修改问答题
					axios.post('/com/exam/editQNRLib', qs.stringify({
						examLibID: self.QNRForm.ExamLibID,

						examLibQIDs: self.examLibQIDs,
						question: {
							QID:item.QID,
							ExamLibQID: item.ExamLibQID,
							QuestionType: item.QuestionType,
							QuestionTitle: item.QuestionTitle,
						},
					})).then( (res) => {
						var d = res.data;
						if(d.flag == 1){
							self.$message.success('编辑成功');

							self.QNRForm.Questions[outerIndex].editFlag = false;
							self.editFlag = false;
							self.cancelOneFlag = false;

							this.editOldQNRTopic = false; // 恢复默认未旧题目
							this.createNewQNRTopic = false; // 未新增

						}else{
							self.$message.error(d.msg);
						}
					} );
				}

			},

			doSendNewTopic(item,outerIndex){
				let self =this;
				if(item.QuestionType == 2){ // 单选题

					axios.post('/com/exam/editQNRLib', qs.stringify({
						examLibID: self.QNRForm.ExamLibID,
						examLibQIDs: self.examLibQIDs,
						question: {
							QuestionType: item.QuestionType,
							QuestionTitle: item.QuestionTitle,
							IsNeed: item.IsNeed,
							Answers:  item.Answers,
						},
					})).then( (res) => {
						var d = res.data;
						if(d.flag == 1){
							self.$message.success('编辑成功');

                            self.getQNRId();
							self.QNRForm.Questions[outerIndex].editFlag = false;
							self.editFlag = false;
							self.cancelOneFlag = false;

							self.editOldQNRTopic = false; // 未修改旧题目
							self.createNewQNRTopic = false; // 未新增

						}else{
							self.$message.error(d.msg);
						}
					} );

				}else if(item.QuestionType == 1){ // 多选题
					axios.post('/com/exam/editQNRLib', qs.stringify({
						examLibID: self.QNRForm.ExamLibID,
						examLibQIDs: self.examLibQIDs,
						question: {
							QuestionType: item.QuestionType,
							QuestionTitle: item.QuestionTitle,
							IsNeed: item.IsNeed,
							LimitAnswerNum : item.LimitAnswerNum,
							Answers:  item.Answers,
						},
					})).then( (res) => {
						var d = res.data;
						if(d.flag == 1){
							self.$message.success('编辑成功');
                            self.getQNRId();

							if(item.LimitAnswerNum > 0){
								item.limitChecked = true;
                            }else{
								item.limitChecked = false;
                            }

							self.QNRForm.Questions[outerIndex].editFlag = false;
							self.editFlag = false;
							self.cancelOneFlag = false;
							self.editOldQNRTopic = false; // 未修改旧题目
							self.createNewQNRTopic = false; // 未新增

						}else{
							self.$message.error(d.msg);
						}
					} );

				}else if(item.QuestionType == 3){ // 修改问答题
					axios.post('/com/exam/editQNRLib', qs.stringify({
						examLibID: self.QNRForm.ExamLibID,
						examLibQIDs: self.examLibQIDs,
						question: {
							QuestionType: item.QuestionType,
							QuestionTitle: item.QuestionTitle,
							IsNeed: item.IsNeed,
							Answers:  item.Answers
						},
					})).then( (res) => {
						var d = res.data;
						if(d.flag == 1){
							self.$message.success('编辑成功');

                            self.getQNRId();
							self.QNRForm.Questions[outerIndex].editFlag = false;
							self.editFlag = false;
							self.cancelOneFlag = false;
							self.editOldQNRTopic = false; // 未修改旧题目
							self.createNewQNRTopic = false; // 未新增

						}else{
							alert(2222)
							self.$message.error(d.msg);
						}
					} );
				}
            },

			saveAnswerOne(outer,outerIndex, type){   // 保存一试题     type 1,多选 2,单选 3 问答
				let self =this;
				self.isNeedChange(outerIndex);
				var status = self.judgeQNROkOne(outerIndex, type),
					flag = status.flag;
				if(flag){ // 全部填写之后

					this.getAllTopicId(); // 获取所有id

					if(self.editOldQNRTopic == true){// 保存修改后的旧题目
						self.doSendOldTopic(outer,outerIndex);
					}else if(self.createNewQNRTopic = true){
						self.doSendNewTopic(outer,outerIndex); // 保存新增的题目
					}

				}else{
					this.$message.error(status.msg);
				}

			},

			judgeQNROkOne(outerIndex,type){

				let outer = this.QNRForm.Questions[outerIndex];
				let one = outer, // 一道问卷题目
					answers = one.Answers,
					len = answers.length,
					status = {flag: true, msg: ''};
				if(!answers){
					return false;
				}

				if(type == 3){   // 问答
					if(!one.QuestionTitle) return {flag: false, msg: '请输入标题'};
				}else{  // 单选 + 多选
					if(!one.QuestionTitle) return {flag: false, msg: '请输入标题'};
					for(var i= 0; i<len; i++){
						if(!answers[i].AnswerValue){
							return {flag: false, msg: '请输入问题描述'};
						}
					}
				}
				if(type == 1){
					if(outer.EditlimitChecked){
						if(outer.LimitAnswerNum>0){
							if(outer.LimitAnswerNum <= outer.Answers.length){

							}else{
								return {flag: false, msg: '最多可选项必须小于答案选项总数'};

							}
						}else if(outer.LimitAnswerNum == '0'){
							return {flag: false, msg: '最多可选项不能为0'};
						}else if(!outer.LimitAnswerNum){
							return {flag: false, msg: '请输入最多可选项'};
                        }else{
							return {flag: false, msg: '最多可选项值不能小于0'};
                        }
					}else if(!outer.EditlimitChecked){
						outer.LimitAnswerNum = "";
					}
				}
				return status;

			},

			cancelAnswerOne(outerIndex){      // (题目里的)取消编辑
				this.editFlag = false;
				this.QNRForm.Questions.splice(outerIndex, 1);


			},

			holdOldOne(index){ //修改状态下的取消按钮
				this.editFlag = false;
				this.QNRForm.Questions[index].editFlag = false;
			},

			outAddBtn: function(){  // 下方添加题目按钮
				clearTimeout(this.outTimeId);
				this.outTimeId = setTimeout(()=>{
					this.addBtnFlag = true;
				}, 600);
			},

			moveAddBtn: function(){
				clearTimeout(this.outTimeId);
			},

			addOver: function(){  // 鼠标移入按钮
				this.addBtnFlag = false
			},

			delEdit(outerIndex){

				this.$confirm('确认删除？').then(()=>{
					this.editFlag = false;
					this.QNRForm.Questions.splice(outerIndex, 1);
				}).catch( ()=>{
					//
				})

			},

			editOne(index){   // 编辑一道题（左侧编辑按钮）
				if(this.editFlag){
					this.$message(this.editTip);
					return ;
				}
				this.editOldQNRTopic = true; // 修改旧题目
				this.createNewQNRTopic = false; // 未新增
				this.editFlag = true;
				this.QNRForm.Questions[index].editFlag = true;
				this.cancelOneFlag = true;
				let extend = this.QNRForm.Questions[index];
				if(extend.QuestionType == 1){
					if(extend.LimitAnswerNum >0){
						extend.EditlimitChecked = true;
						extend.limitChecked = true;
					}else{
						extend.EditlimitChecked = false;
						extend.limitChecked = false;
						extend.LimitAnswerNum = "";
					}
				}

			},

            getAllDelID(index,outer){
				let self = this;
				if(self.editFlag){
					self.$message(self.editTip);
					return ;
				}
				let oldArr = [];
				self.QNRForm.Questions.forEach((one)=>{
					oldArr.push(Number(one.ExamLibQID));
				});
				let arr = oldArr;
				console.log(arr)
				console.log(outer.ExamLibQID)
                arr.splice(index,1);
				console.log(arr)
				let str= arr.join(",");
				self.examLibQIDs = str; /* 赋值examLibQIDs */
            },

			delOne(index,outer){   // 一道题目的删除（左侧删除按钮）--显示状态下
                let self =this;

                this.getAllDelID(index,outer);
				axios.post('/com/exam/editQNRLib', qs.stringify({
					examLibID: self.QNRForm.ExamLibID,
					examLibQIDs: self.examLibQIDs,
					delQID: outer.ExamLibQID,
				})).then( (res) => {
					var d = res.data;
					if(d.flag == 1){
						this.$message.success('删除成功');
						this.QNRForm.Questions.splice(index, 1);

					}else{
						this.$message.error(d.msg);
					}
				} );
				/*this.$confirm('确认删除？').then(()=>{

				}).catch( ()=>{
					//
				})*/
			},

			switchUp(one,index,list,outer){   //向上按钮  升序
				let self = this;
				self.contentList = list; /*一个Answers*/
				self.contentList.splice(index,1);
				self.contentList.splice(index-1,0,one);
				let itemNewLast = self.contentList[index-1].answersOne;  //上一个
				let itemNewNext = self.contentList[index].answersOne;  //下一个
				one.answersOne = itemNewNext;
				self.contentList[index].answersOne = itemNewLast;

			},

			switchDown(one,index,list,outer){   // 向下按钮 降序
				let self = this;
				self.contentList = list; /*一个Answers*/
				self.contentList.splice(index,1);
				self.contentList.splice(index+1,0,one);
				let itemNewLast = self.contentList[index].answersOne;  //上一个
				let itemNewNext = self.contentList[index+1].answersOne;  //下一个
				one.answersOne = itemNewLast;
				self.contentList[index].answersOne = itemNewNext;
			},

			delAnswerOne: function(outerIndex, index){      // 删除小题中的选项
				var one = this.QNRForm.Questions[outerIndex];
				if(one){
					one.Answers = Array.prototype.slice.call(one.Answers, 0);
					one.Answers.splice(index, 1);
				}


			},

			/*submitForm: function(formName){  // 提交
				if(this.editFlag){
					this.$message.error(this.editTip);
					return ;
				};

				this.$refs[formName].validate((valid) => {
					if (valid) {
						this.doAxios();
					} else {
						return false;
					}
				});
			},

			doAxios: function(){

				var questions = this.QNRForm.Questions;

				questions = com.toArray(questions);
				questions.forEach( (one)=>{
					for(var iOne, i=0,len=one.Answers.length; i<len; i++){
						iOne = one.Answers[i];
						iOne.AnswerKey = answerArr[i];
					}
				} )
				questions = null;

				/!*let TrainID = this.$route.query.TrainID;// 培训id
				console.log(TrainID);
				console.log(this.QNRForm);
				this.QNRForm["TrainID"] = TrainID;
				console.log(this.QNRForm);*!/

				axios.post('/com/exam/editQNRLib', qs.stringify(  // 编辑问卷库问卷(修改不返回新id)  com/exam/editQNRLib
					this.QNRForm,
				)).then( (res)=>{
					var d = res.data;
					if(d.flag == 1){

						this.QNRTitle.paperFlag = false;
						this.QNRDes.paperFlag = false;

						this.editFlag = false;
						this.$message.success('上传成功');
					}else{
						this.$message.error(d.msg);
                    }
				} );
			},*/


			doSaveQNRTitle(){
				let self =this;
				/*com/exam/editQNRLib*/
				axios.post('/com/exam/editQNRLib', qs.stringify({
					examLibID:self.ExamQNRID,
					examTitle: self.QNRForm.ExamTitle,
                })).then( (res) => {
                    var d = res.data;
                    if(d.flag == 1){
						this.$message.success('编辑成功');
						this.QNRTitle.paperFlag = false;
                    }else{
                        this.$message.error(d.msg);
                    }
                } );
            },

			doSaveQNRDes(){
				let self =this;
				/*com/exam/editQNRLib*/
				axios.post('/com/exam/editQNRLib', qs.stringify({
					examLibID:self.ExamQNRID,
					ExamDesc: self.QNRForm.ExamDesc,
				})).then( (res) => {
					var d = res.data;
					if(d.flag == 1){
						this.$message.success('编辑成功');
						this.QNRDes.paperFlag = false;
					}else{
						this.$message.error(d.msg);
					}
				} );
            },


			limitCheckedChange(outerIndex){
				let aa = this.QNRForm.Questions[outerIndex];
				console.log(aa)
				console.log(aa.EditlimitChecked)
				if(aa.EditlimitChecked){
					if(aa.LimitAnswerNum > 0){
						if(aa.LimitAnswerNum <= aa.Answers.length){

						}else{
							this.$message.error('最多可选项必须小于答案选项总数');

						}
					}else{
//						this.$message.error('请输入最多可选项');
					}
				}else{
					aa.LimitAnswerNum = "";
				}
			},

			limitBlur(outerIndex){ // 当最多选项值改变的时候
				let bb = this.QNRForm.Questions[outerIndex];
				if(bb.EditlimitChecked){
					if(bb.LimitAnswerNum>0){
						if(bb.LimitAnswerNum <= bb.Answers.length){

						}else{
							this.$message.error('最多可选项必须小于答案选项总数');

						}
					}else{
						this.$message.error('请输入最多可选项');
					}
				}else{
					bb.LimitAnswerNum = "";
				}
			},

			isNeedChange(outerIndex){
				let outer = this.QNRForm.Questions[outerIndex];
				if(outer.QuestionType == 1){ //多选
					one();
                }else if(outer.QuestionType == 2){ // 单选
					one();
                }else if(outer.QuestionType == 3){
					one();
                }
                function one(){
					if(outer.isSingleNeed){
						outer.IsNeed = "1";
					}else if(!outer.isSingleNeed){
						outer.IsNeed = "0";
					}
                }

			},

			getAllTopicId(){  // 获取所有题目id
				let self =this;
				let oldArr = [];
				self.QNRForm.Questions.forEach((one)=>{
					oldArr.push(Number(one.ExamLibQID));
				});
				let arr = oldArr;
				console.log('获取所有题目id');
				console.log(arr);

				let str= arr.join(",");
				self.examLibQIDs = str; /* 赋值examLibQIDs */
				console.log(self.examLibQIDs);

			},

			delEditOne(index,outer){ /*编辑状态下===旧试题===的删除*/
				let self = this;

				let ExamQNRID = self.$route.query.ExamQNRID;
				self.getAllDelEditID(index,outer);
				axios.post('/com/exam/editQNRLib', qs.stringify({ /*编辑库问卷*/
					examLibID: ExamQNRID,
					examLibQIDs: self.examLibQIDs,
					delQID: outer.ExamLibQID,
				})).then( (res) => {

					var d = res.data;
					if(d.flag == 1){
						self.QNRForm.Questions.splice(index, 1);
						self.$message.success('删除成功');
						self.editFlag = false;
						self.QNRForm.Questions[index].editFlag= false;
					}else{
						self.$message.error(d.msg);
					}
				} );
			},

			getAllDelEditID(index,outer){  /*旧试题--编辑状态--删除*/
				let self = this;

				let oldArr = [];
				self.QNRForm.Questions.forEach((one)=>{
					oldArr.push(Number(one.ExamLibQID));
				});
				let arr = oldArr;
				console.log(arr)
				console.log(outer.ExamLibQID)
				arr.splice(index,1);
				console.log(arr)
				let str= arr.join(",");
				self.examLibQIDs = str; /* 赋值examLibQIDs */
			},

		},
		mounted: function(){
			this.getQNRId();





			/*axios.post('/xxx', qs.stringify({})).then( (res) => {
                var d = res.data;
                if(d.flag == 1){
                    console.log(d);
                }else{
                    this.$message.error(d.msg);
                }
            } );*/
		}
	}


</script>
